<template>
	<div class="system-notice-dialog-container">
		<el-dialog :title="state.dialog.title" v-model="state.dialog.isShowDialog" width="769px">
			<el-descriptions title="操作日志详细" direction="horizontal" :column="0" size="default" border>
				<el-descriptions-item label="操作人员">{{ state.ruleForm.operName }}</el-descriptions-item>
				<el-descriptions-item label="操作模块">{{ state.ruleForm.title }} / {{ state.typeFormat
				}}</el-descriptions-item>
				<el-descriptions-item label="请求地址">{{ state.ruleForm.operUrl }}</el-descriptions-item>
				<el-descriptions-item label="请求方式">{{ state.ruleForm.requestMethod }}</el-descriptions-item>
				<el-descriptions-item label="操作方法">{{ state.ruleForm.method }}</el-descriptions-item>
				<el-descriptions-item label="请求参数">
					<el-input type="textarea" :rows="3" v-model="state.ruleForm.operParam" />
				</el-descriptions-item>
				<el-descriptions-item label="返回参数" :span="2">{{ state.ruleForm.jsonResult }}</el-descriptions-item>
				<el-descriptions-item label="操作状态">
					<el-tag size="small" v-if="state.ruleForm.status == '0'" type="success">成功</el-tag>
					<el-tag size="small" v-if="state.ruleForm.status == '1'" type="danger">失败</el-tag>
				</el-descriptions-item>
				<el-descriptions-item label="异常信息" v-if="state.ruleForm.status == '1'">
					<el-input type="textarea" :rows="3" v-model="state.ruleForm.errorMsg" />
				</el-descriptions-item>
				<el-descriptions-item label="登录信息">{{ state.ruleForm.operName }} / {{ state.ruleForm.operIp }} / {{ state.ruleForm.operLocation }}</el-descriptions-item>
				<el-descriptions-item label="操作时间">{{ state.ruleForm.operTime }}</el-descriptions-item>
			</el-descriptions>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="onCancel" size="default">关闭</el-button>
				</span>
			</template>
		</el-dialog>
	</div>
</template>

<script setup lang="ts" name="systemOperlogDialog">
import { reactive } from 'vue';
const state = reactive({
	ruleForm: {
		operId: '',
		title: '',
		businessType: 0,
		businessTypes: null,
		method: '',
		requestMethod: '',
		operatorType: 0,
		operName: '',
		deptName: '',
		operUrl: '',
		operIp: '',
		operLocation: '',
		operParam: '',
		jsonResult: '',
		status: '',
		errorMsg: '',
		operTime: '',
		params: {},
	},
	typeFormat: '',
	dialog: {
		isShowDialog: false,
		title: '',
		submitTxt: '',
	},
});

// 打开弹窗
const openDialog = (row: RowOperlogType, typeFormat: any) => {
	state.dialog.title = '日志详细信息'
	state.dialog.submitTxt = '确定'
	state.ruleForm = row;
	state.typeFormat = typeFormat;
	state.dialog.isShowDialog = true;
};

// 初始化日志数据
const getNoticeRuleForm = () => {
	state.ruleForm = {
		operId: '',
		title: '',
		businessType: 0,
		businessTypes: null,
		method: '',
		requestMethod: '',
		operatorType: 0,
		operName: '',
		deptName: '',
		operUrl: '',
		operIp: '',
		operLocation: '',
		operParam: '',
		jsonResult: '',
		status: '',
		errorMsg: '',
		operTime: '',
		params: {},
	};
};






// 取消
const onCancel = () => {
	closeDialog();
	getNoticeRuleForm();
};
// 关闭弹窗
const closeDialog = () => {
	state.dialog.isShowDialog = false;
};// 暴露变量
defineExpose({
	openDialog,
});
</script>